import { Card, Table } from 'antd';
import { useEffect, useState } from 'react';
import { nanoid } from 'nanoid';

const RelationList = (props) => {
    const [tableData, setTableData] = useState();

    console.log('props.controlData', props.controlData);
    const [controlData, setControlData] = useState(() =>
        props.controlData ? props.controlData : [],
    );
    const [enterprise, setEnterprise] = useState(props.enterprise);
    const columns = [
        {
            title: '序号',
            render: (text, record, index) =>
                `${(pageOption.pageNo - 1) * pageOption.pageSize + (index + 1)}`,
            width: '10%',
            key: "number"
        },
        {
            title: '股东一',
            dataIndex: 'HolderOne',
            width: '30%',
            textWrap: 'word-break',
            ellipsis: true,
            key: "holder1"
        },
        {
            title: '股东二',
            dataIndex: 'HolderTwo',
            width: '30%',
            textWrap: 'word-break',
            ellipsis: true,
            key: "holder2"
        },
        {
            title: '关系类型',
            dataIndex: 'Type',
            width: '15%',
            textWrap: 'word-break',
            ellipsis: true,
            key: "type"
        },
        {
            title: '关系权重',
            dataIndex: 'Percent',
            width: '15%',
            render: (text, record, index) => (text * 100).toFixed(2) + '%',
            defaultSortOrder: 'descend',
            sortDirections: ['descend', 'ascend'],
            sorter: (a, b) => a.controlPower - b.controlPower,
            key: "percent"
        },
    ];

    const generateRelation = (controlData) => {
        const result = controlData;
        let resultArr = result.data.relations.relations;
        const refList = new Map();
        result.data.relations.nodes.forEach((item) => refList.set(item.id, item.name));

        const NewResultArr = resultArr
            .map((item) => {
                item[0] = refList.get(item[0]) ? refList.get(item[0]) : undefined;
                item[1] = refList.get(item[1]) ? refList.get(item[1]) : undefined;
                let type = '';
                switch (item[2]) {
                    case '2':
                        type = '关联关系';
                        break;
                    case '5':
                        type = '一致行动关系';
                        break;
                    case '6':
                        type = '亲戚关系';
                        break;
                    default:
                        type = '';
                }
                return {
                    HolderOne: item[0],
                    HolderTwo: item[1],
                    Type: type,
                    Percent: item[3],
                };
            }).filter((item) => item.HolderOne && item.HolderTwo);
        console.log('NewResultArr', NewResultArr);
        setTableData(NewResultArr);
    };
    //数据源
    const dataSource = tableData;
    useEffect(() => {
        if (props.controlData) {
            generateRelation(props.controlData);
        }
    }, [props.controlData]);

    //分页默认值
    const [pageOption, setPageOption] = useState({
        pageNo: 1,
        pageSize: 10,
    });

    //分页配置
    const paginationProps = {
        current: pageOption.pageNo,
        pageSize: pageOption.pageSize,
        onChange: (current, size) => paginationChange(current, size),
    };

    const paginationChange = async (current, size) => {
        setPageOption({
            pageNo: current,
            pageSize: size,
        });
    };
    return (
        <>
            <Table
                size="small"
                dataSource={dataSource}
                columns={columns}
                pagination={paginationProps}
                rowKey={nanoid()}
            ></Table>
        </>
    );
};

export default RelationList;
